<html>
<head>
<title>Select an Icon</title>
<style type="text/css">

body { 
	font-family: Calibri,Verdana;
	font-size: 14px;
}

a {
	text-decoration: none;
}

td {
	padding: 3px;
	border-style: solid;
	border-color: #666666;
	border-width: 1px;
	border-collapse: collapse;
	font-size: 12px;
	text-align: center;
}

.rightalign {
	text-align: right;
}

.info {
	padding: 5px;
	border-width: 0px;
	font-size: 14px;
}
</style>

<script>

var i  = 0
var ii = 0
var s  = ""
var ss = ""
var h  = 0
var v  = 0
var h1 = 0
var v1 = 0
var h2 = 0
var v2 = 0
var curjpg = 0

window.returnValue = "cancel";

curjpg = parseInt(window.dialogArguments);

//alert("incoming curjpg="+curjpg.toString()+"");

var jpgs = new Array   ("icon_ss1.jpg","icon_ss2.jpg","icon_ss3.jpg","icon_ss4.jpg","icon_ss5.jpg",
						"icon_ss6.jpg","icon_ss7.jpg","icon_ss8.jpg","icon_ss9.jpg","icon_ss10.jpg",
						"icon_ss11.jpg","icon_ss12.jpg","icon_ss14.jpg","icon_ss15.jpg","icon_ss16.jpg",
						"icon_ss17.jpg","icon_ss18.jpg","icon_ss19.jpg","icon_ss20.jpg","icon_ss21.jpg",
						"icon_ss22.jpg","icon_ss23.jpg","icon_ss24.jpg","icon_ss25.jpg","icon_ss26.jpg");

function ImgDisplay(how) {

	how = curjpg + how;
	//alert("curjpg1="+curjpg.toString()+"   how="+how.toString()+"   jpgs[how]="+jpgs[how]);
	
	if (how > jpgs.length - 1) { how = 0; }
	if (how < 0) { how = jpgs.length - 1; }
	//alert("curjpg2="+curjpg.toString()+"   how="+how.toString()+"   jpgs[how]="+jpgs[how]);

	document.getElementById("imgfile").innerHTML = jpgs[how];
	document.form.image.src = "./" + jpgs[how];
	curjpg = how;
	//alert("curjpg3="+curjpg.toString()+"   how="+how.toString()+"   jpgs[how]="+jpgs[how]);

}

function UsePic(h,v) {

	h1 = (h * 42); v1 = (v * 42);
	h2 = (h1 + 42); v2 = (v1 + 42);

	//alert("("+h1.toString()+","+v1.toString()+","+h2.toString()+","+v2.toString()+")");
	i = (jpgs[curjpg]).length - 4;
	s = String(jpgs[curjpg]).substring(0, i);  // strip off the ".jpg"
	s = s + "|" + h1 + "," + v1 + "," + h2 + "," + v2 + "|" + curjpg;
	window.returnValue = s;
	self.close();
}

function CloseWin() {
	window.returnValue = "cancel";
	self.close();
}

</script>
</head>

<body onLoad="javascript:ImgDisplay(0);">

<form name=form>

<table align=center border=0>
<tr>
	<td height=280 colspan=5>
		<img id="image" name="image" src="./icon_as1.jpg" usemap="#imgmap">
	</td>
</tr>
<tr>
	<td width=10% bgcolor=aaaaaa><a href="javascript:ImgDisplay(999);"><b>&lt;&lt;&nbsp;</b></a></td>
	<td width=10% bgcolor=aaaaaa><a href="javascript:ImgDisplay(-1);"><b>&lt;&nbsp;Back</b></a></td>
	<td bgcolor=cccccc><span id="imgfile">x</span></td>
	<td width=10% bgcolor=aaaaaa align=right><a href="javascript:ImgDisplay(1);"><b>Next&nbsp;&gt;</b></a></td>
	<td width=10% bgcolor=aaaaaa><a href="javascript:ImgDisplay(-999);"><b>&gt;&gt;&nbsp;</b></a></td>
</tr>
<tr>
	<td class=info bgcolor=ffffff colspan=2 height=12>&nbsp;</td>
	<td class=info bgcolor=ffffff height=12><center><b>Select an icon</b></center></td>
	<td class=info bgcolor=ffffff colspan=2 height=12><a href="javascript:CloseWin();">(cancel)</a></td>
</tr>
</table><map id="imgmap" NAME="imgmap">
<area href="javascript:UsePic(0,0);" shape="RECT" coords="0,0,42,42">
<area href="javascript:UsePic(1,0);" shape="RECT" coords="42,0,84,42">
<area href="javascript:UsePic(2,0);" shape="RECT" coords="84,0,126,42">
<area href="javascript:UsePic(3,0);" shape="RECT" coords="126,0,168,42">
<area href="javascript:UsePic(4,0);" shape="RECT" coords="168,0,210,42">
<area href="javascript:UsePic(5,0);" shape="RECT" coords="210,0,252,42">
<area href="javascript:UsePic(0,1);" shape="RECT" coords="0,42,42,84">
<area href="javascript:UsePic(1,1);" shape="RECT" coords="42,42,84,84">
<area href="javascript:UsePic(2,1);" shape="RECT" coords="84,42,126,84">
<area href="javascript:UsePic(3,1);" shape="RECT" coords="126,42,168,84">
<area href="javascript:UsePic(4,1);" shape="RECT" coords="168,42,210,84">
<area href="javascript:UsePic(5,1);" shape="RECT" coords="210,42,252,84">
<area href="javascript:UsePic(0,2);" shape="RECT" coords="0,84,42,126">
<area href="javascript:UsePic(1,2);" shape="RECT" coords="42,84,84,126">
<area href="javascript:UsePic(2,2);" shape="RECT" coords="84,84,126,126">
<area href="javascript:UsePic(3,2);" shape="RECT" coords="126,84,168,126">
<area href="javascript:UsePic(4,2);" shape="RECT" coords="168,84,210,126">
<area href="javascript:UsePic(5,2);" shape="RECT" coords="210,84,252,126">
<area href="javascript:UsePic(0,3);" shape="RECT" coords="0,126,42,168">
<area href="javascript:UsePic(1,3);" shape="RECT" coords="42,126,84,168">
<area href="javascript:UsePic(2,3);" shape="RECT" coords="84,126,126,168">
<area href="javascript:UsePic(3,3);" shape="RECT" coords="126,126,168,168">
<area href="javascript:UsePic(4,3);" shape="RECT" coords="168,126,210,168">
<area href="javascript:UsePic(5,3);" shape="RECT" coords="210,126,252,168">
<area href="javascript:UsePic(0,4);" shape="RECT" coords="0,168,42,210">
<area href="javascript:UsePic(1,4);" shape="RECT" coords="42,168,84,210">
<area href="javascript:UsePic(2,4);" shape="RECT" coords="84,168,126,210">
<area href="javascript:UsePic(3,4);" shape="RECT" coords="126,168,168,210">
<area href="javascript:UsePic(4,4);" shape="RECT" coords="168,168,210,210">
<area href="javascript:UsePic(5,4);" shape="RECT" coords="210,168,252,210">
<area href="javascript:UsePic(0,5);" shape="RECT" coords="0,210,42,252">
<area href="javascript:UsePic(1,5);" shape="RECT" coords="42,210,84,252">
<area href="javascript:UsePic(2,5);" shape="RECT" coords="84,210,126,252">
<area href="javascript:UsePic(3,5);" shape="RECT" coords="126,210,168,252">
<area href="javascript:UsePic(4,5);" shape="RECT" coords="168,210,210,252">
<area href="javascript:UsePic(5,5);" shape="RECT" coords="210,210,252,252"></map>

</form>

</body>
</html>


